<style>
    .layui-card {
        width: 95%;
        /* min-height: 900px; */
        margin: 0 auto;
        margin-top: 32px;
        border-radius: 8px;
        padding: 10px 15px;
        box-sizing: border-box;
    }
    
    .zhuangtai {
        float: left;
        font-size: 18px;
        margin-right: 12px;
    }
    
    .sanbut {
        float: right;
        display: flex;
        justify-content: space-around;
        align-items: center;
        /* position: absolute;
    right: 0;
    top: 0; */
    }
    
    .layui-btn-normal {
        background-color: #FFFFFF;
        color: black;
        border: 1px solid #DCDFE6;
    }
    
    th {
        border: transparent !important;
    }
    
    tr {
        border-bottom: 1px solid #F5F5F5;
    }
    
    .layui-btn-danger {
        background-color: #F87C7E;
    }
    
    .aa {
        border-radius: 8px;
        background-color: #F5F5F5;
        padding-left: 10px;
        color: black;
    }
    
    .bb {
        background-color: #06B991;
        display: inline-block;
        min-width: 90px;
        height: 38px;
        line-height: 38px;
        padding: 0 18px;
        /* background-color: transparent; */
        color: #fff;
        white-space: nowrap;
        text-align: center;
        font-size: 14px;
        border: none;
        /* border-radius: 2px; */
        cursor: pointer;
        border-radius: 8px;
        /* border: 1px solid #DCDFE6; */
        margin-right: 10px;
    }
    
    .layui-btn {
        display: inline-block;
    }
    
    .cc {
        min-width: 190px;
        font-size: 15px;
    }
    
    .xy {
        font-size: 18px;
        width: 100%;
        text-align: center;
        margin-top: 12px;
    }
    
    .xy>input {
        margin-left: 22.5px;
        border-radius: 8px;
        background-color: #F5F5F5;
        height: 24.5px;
        width: 162px;
        padding-left: 10px;
        border: none;
    }
    
    .put>input {
        margin-left: 5.5px;
        border-radius: 8px;
        background-color: #F5F5F5;
        height: 24.5px;
        width: 162px;
        padding-left: 10px;
        border: none;
    }
    
    tr {
        border: 1px solid #F5F5F5;
    }
    
    .layui-card .layui-tab {
        margin-top: 50px;
    }
    
    .layui-tab-brief>.layui-tab-more li.layui-this:after,
    .layui-tab-brief>.layui-tab-title .layui-this:after {
        border: none;
        border-radius: 0;
    }
    
    .layui-card .layui-tab-brief .layui-tab-title li {
        margin: 0 10px;
        padding: 0 10px;
        line-height: 30px;
    }
    
    .dd {
        background-color: #FEA858;
    }
    
    .layui-input-block {
        border-radius: 8px;
        padding-left: 10px;
    }
    
    .layui-form-select .layui-input {
        border-radius: 8px;
        background-color: #F5F5F5;
    }
</style>
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-form layui-card-header layuiadmin-card-header-auto" lay-filter="layadmin-useradmin-formlist">
            <div class="layui-form-item">
                <div class="layui-inline">
                    <div class="layui-form-item">
                        <div class="layui-input-inline">
                            <select name="interest-search" id="soso" lay-filter="interest-search" lay-search style="background-color: #F5F5F5;">
                        </select>
                        </div>
                    </div>
                </div>
                <!-- <div class="sanbut">
                    <button class="layui-btn layuiadmin-btn-admin bb" style="float: right;margin-left: 10px;" data-type="add" id="add">新增</button>
                </div> -->
            </div>
            <table id="LAY-app-message-all" lay-filter="LAY-app-message-all"></table>
            <script type="text/html" id="table-useradmin-all">
                <!-- <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit">编辑</a> -->
                <a class="layui-btn layui-bg-red layui-btn-xs" lay-event="chongqi">重启</a>
                <a class="layui-btn layui-bg-red layui-btn-xs" lay-event="zhijian">自检</a>
                <a class="layui-btn layui-bg-red layui-btn layui-btn-sm" lay-event="hfccsz">恢复出厂设置</a>
                <a class="layui-btn layui-bg-red layui-btn layui-btn-sm" lay-event="bbsj">版本升级</a>
                <!-- <a class="layui-btn layui-bg-black layui-btn-sm" lay-event="del">删除</a> -->
            </script>
        </div>
        <div id="demo5" style="text-align: center;"></div>
    </div>
</div>

<script>
    layui.use('useradmin', layui.factory('useradmin')).use(['admin', 'useradmin', 'table', "laypage", 'laydate'], function() {
        var $ = layui.$,
            admin = layui.admin,
            view = layui.view,
            setter = layui.setter,
            table = layui.table,
            laypage = layui.laypage,
            laydate = layui.laydate,
            form = layui.form;


        form.render(null, 'layadmin-userfront-formlist');
        //监听搜索
        form.on('submit(LAY-user-front-search)', function(data) {

            var field = data.field;
            //执行重载
            table.reload('LAY-app-message-all', {
                where: field
            });
        });

        var test = ""
        admin.req({
            url: setter.request.baseUrl + "agv-info/query",
            data: JSON.stringify({
                pageNum: 1,
                pageSize: 100
            }),
            type: "POST",
            dataType: "json",
            contentType: "application/json;charset=UTF-8",
            done: function(res) {
                console.log(res);
                var html = "<option style='color:#e6e6e6;' value=''>请选择车辆编号</option>";
                for (i = 0; i < res.info.length; i++) {
                    html += "<option value=" + res.info[i].agvId + ">" + res.info[i].agvId + "</option>"
                }
                $("#soso").empty().append(html)
                form.render('select'); //需要渲染一下
            },

        });
        //事件下拉框数据发生变化时
        form.on('select(interest-search)', function(data) {
            // 调用搜索函数
            var data_val = data.value; //当前选中的数据
            if (data_val == "") {
                // 查询所有的数据,不传的时候就是查询所有的
                getData(1, '')
            } else {
                getData(1, data_val)
            }
            console.log(data);

        });
        getData(1, '')

        function getData(pageNum, agvId) {
            table.render({
                //接口
                elem: "#LAY-app-message-all",
                url: setter.request.baseUrl + "agv-device-status/query",
                data: JSON.stringify({
                    a: 111
                }),
                where: {
                    pageNum: pageNum,
                    pageSize: 10,
                    agvId: agvId
                },
                contentType: "application/json;charset=UTF-8",
                method: "POST",
                response: {
                    statusName: "code",
                    statusCode: 0,
                    msgName: "msg",
                    countName: "totalCount",
                    dataName: "info",
                },
                page: false,
                done: function(res, curr, count) {
                    console.log(res)
                    laypage.render({
                        elem: 'demo5',
                        count: res.pageResponseDTO.total,
                        curr: pageNum,
                        limit: 10,
                        jump: function(obj, first) {
                            if (!first) {
                                // that.shuju.pageNum = obj.curr;
                                getData(obj.curr)
                            }
                        }
                    });
                },
                cols: [
                    [{
                        field: "agvId",
                        title: "车辆编号",
                        align: 'center',
                        width: '10%',
                    }, {
                        field: "companyName",
                        title: "所属公司",
                        align: 'center',
                        width: '20%',
                    }, {
                        field: "ctrlId",
                        title: "控制板编号",
                        align: 'center',
                        width: '20%',
                    }, {
                        field: "ctrlStatus",
                        title: "控制板状态",
                        templet: "#ctrlStatus",
                        align: 'center',
                        width: '10%',
                    }, {
                        field: "agvId",
                        title: "工控板编号",
                        align: 'center',
                        width: '10%',
                    }, {
                        field: "agvStatus",
                        title: "工控板状态",
                        templet: "#agvStatus",
                        align: 'center',
                        width: '10%',
                    }, {
                        fixed: "right",
                        title: "远程控制",
                        width: '20%',
                        toolbar: "#table-useradmin-all",
                        align: 'center',
                    }, ],
                ],
            });

        }
        //新增
        var active = {
            add: function() {
                admin.popup({
                    title: '新增设备信息',
                    area: ['600px', '550px'],
                    id: 'LAY-popup-useradmin-add',
                    success: function(layero, index) {
                        view(this.id).render('testproduct/form').done(function() {
                            form.render(null, 'layuiadmin-form-admin');
                            layui.laydate.render({
                                type: 'datetime',
                                elem: '#date' //指定元素
                            });
                            //监听提交
                            form.on('submit(LAY-user-back-submit)', function(data) {
                                var field = data.field; //获取提交的字段
                                //新增用户信息  
                                admin.req({
                                    url: setter.request.baseUrl + "agv-device-status/add",
                                    data: JSON.stringify({
                                        'agvId': parseInt(field.agvId),
                                        'ctrlId': parseInt(field.ctrlId),
                                    }),
                                    type: "POST",
                                    dataType: "json",
                                    contentType: "application/json;charset=UTF-8",
                                    done: function(res) {
                                        console.log('新增', res);
                                        layui.table.reload('LAY-app-message-all'); //重载表格
                                        layer.close(index); //执行关闭 
                                        layer.msg(res.msg);
                                    },

                                });
                            });
                        });
                    }
                });
            }

        };

        $('.layui-btn.layuiadmin-btn-admin').on('click', function() {
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });
        // 编辑
        table.on("tool(LAY-app-message-all)", function(obj) {
            var data = obj.data;
            var shujudata = obj.data;

            if (obj.event === "edit") {
                admin.popup({
                    title: "编辑信息",
                    area: ["500px", "500px"],
                    success: function(layero, index) {
                        view(this.id)
                            .render("testproduct/form", data)

                        .done(function() {
                            layui.laydate.render({
                                type: 'datetime',
                                elem: '#date' //指定元素
                            });
                            let _data = data;
                            form.render(null, "layuiadmin-form-adminbianji");
                            form.on('submit(LAY-user-back-submit)', function(data) {
                                var field = data.field;
                                _data.adminreadstate = 1
                                    // warning
                                editwworkHandle(Object.assign(_data, field));
                                // layui.table.reload('LAY-user-back-manage'); //重载表格
                                layer.close(index);
                            });
                        });
                    },
                });
            } else if (obj.event === "chongqi") {

                admin.popup({
                    title: "重启设置",
                    area: ["200px", "200px"],
                    success: function(layero, index) {
                        view(this.id)
                            .render("testproduct/restart", data)

                        .done(function() {

                            let _data = data;
                            form.render(null, "layuiadmin-form-admichongqi");
                            form.on('submit(LAY-user-back-kzcq)', function(data) {
                                console.log('下面是选中的数据')
                                console.log(shujudata)
                                console.log(data)
                                var type = data.elem.getAttribute('data-type')
                                console.log(type)
                                admin.req({
                                    url: setter.request.baseUrl + "agv-command/add",
                                    data: JSON.stringify({
                                        'agvId': parseInt(shujudata.agvId),
                                        'ctrlId': parseInt(shujudata.ctrlId),
                                        'code': type == 'aaaa' ? 8288 : 4100,
                                        'param': JSON.stringify({}),
                                        'status': 1
                                    }),
                                    type: "POST",
                                    dataType: "json",
                                    contentType: "application/json;charset=UTF-8",
                                    done: function(res) {
                                        console.log('新增', res);
                                        layui.table.reload('LAY-app-message-all'); //重载表格
                                        layer.close(index); //执行关闭 
                                        layer.msg(res.msg);
                                    },

                                });
                                // warning
                                // editwworchongqi(Object.assign(_data, field));
                                // layui.table.reload('LAY-user-back-manage'); //重载表格
                                // layer.close(index);
                            });
                        });
                    },
                });
            } else if (obj.event === "zhijian") {
                admin.popup({
                    title: "自检设置",
                    area: ["200px", "200px"],
                    success: function(layero, index) {
                        view(this.id)
                            .render("testproduct/self", data)

                        .done(function() {

                            let _data = data;
                            form.render(null, "layuiadmin-form-admichongqi");
                            form.on('submit(LAY-user-back-kzcq)', function(data) {
                                console.log('下面是选中的数据')
                                console.log(shujudata)
                                console.log(data)
                                var type = data.elem.getAttribute('data-type')
                                console.log(type)
                                admin.req({
                                    url: setter.request.baseUrl + "agv-command/add",
                                    data: JSON.stringify({
                                        'agvId': parseInt(shujudata.agvId),
                                        'ctrlId': parseInt(shujudata.ctrlId),
                                        'code': type == 'aaaa' ? 8320 : 4102,
                                        'param': JSON.stringify({}),
                                        'status': 1
                                    }),
                                    type: "POST",
                                    dataType: "json",
                                    contentType: "application/json;charset=UTF-8",
                                    done: function(res) {
                                        console.log('新增', res);
                                        layui.table.reload('LAY-app-message-all'); //重载表格
                                        layer.close(index); //执行关闭 
                                        layer.msg(res.msg);
                                    },

                                });
                                // warning
                                // editwworchongqi(Object.assign(_data, field));
                                // layui.table.reload('LAY-user-back-manage'); //重载表格
                                // layer.close(index);
                            });
                        });
                    },
                });
            } else if (obj.event === "hfccsz") {
                admin.popup({
                    title: "恢复出厂设置",
                    area: ["200px", "200px"],
                    success: function(layero, index) {
                        view(this.id)
                            .render("testproduct/restore", data)

                        .done(function() {

                            let _data = data;
                            form.render(null, "layuiadmin-form-admichongqi");
                            form.on('submit(LAY-user-back-kzcq)', function(data) {
                                console.log('下面是选中的数据')
                                console.log(shujudata)
                                console.log(data)
                                var type = data.elem.getAttribute('data-type')
                                console.log(type)
                                admin.req({
                                    url: setter.request.baseUrl + "agv-command/add",
                                    data: JSON.stringify({
                                        'agvId': parseInt(shujudata.agvId),
                                        'ctrlId': parseInt(shujudata.ctrlId),
                                        'code': type == 'aaaa' ? 8304 : 4101,
                                        'param': JSON.stringify({}),
                                        'status': 1
                                    }),
                                    type: "POST",
                                    dataType: "json",
                                    contentType: "application/json;charset=UTF-8",
                                    done: function(res) {
                                        console.log('新增', res);
                                        layui.table.reload('LAY-app-message-all'); //重载表格
                                        layer.close(index); //执行关闭 
                                        layer.msg(res.msg);
                                    },

                                });
                                // warning
                                // editwworchongqi(Object.assign(_data, field));
                                // layui.table.reload('LAY-user-back-manage'); //重载表格
                                // layer.close(index);
                            });
                        });
                    },
                });
            } else if (obj.event === "bbsj") {
                admin.popup({
                    title: "版本升级",
                    area: ["500px", "500px"],
                    success: function(layero, index) {
                        view(this.id)
                            .render("testproduct/upgrade", data)

                        .done(function() {
                            let _data = data;
                            form.render(null, "layuiadmin-form-shengji");
                            form.on('submit(LAY-user-back-gkbsj1)', function(data) {
                                //判断IP地址是否正确IP
                                if (data.field.IP1 != "") {
                                    var IPAddress = data.field.IP1;
                                    var exp = /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/;
                                    var reg = IPAddress.match(exp);
                                    var ErrMsg = "你输入的Agent地址是一个非法的IP地址段！\nIP段为：:xxx.xxx.xxx.xxx（xxx为0-255)！";
                                    if (reg == null) {
                                        // alert(ErrMsg);
                                        layer.msg('你输入的IP地址是一个非法的IP地址段！IP段为：:xxx.xxx.xxx.xxx（xxx为0-255)！')
                                        return false;
                                    } else { //如果某一个数是两位，若前面有0，把0去掉
                                        var IPAddress = data.field.IP1;
                                        var IP = IPAddress.split(".");
                                        var allIp = "";
                                        for (i = 0; i < IP.length; i++) {
                                            if (IP[i].length == 2) {
                                                var index = IP[i].substring(0, 1);
                                                if (index == 0) {
                                                    IP[i] = IP[i].substring(1);
                                                }
                                            }
                                            allIp += IP[i] + ".";
                                        }
                                        allIp = allIp.substring(0, allIp.length - 1);
                                        data.field.IP1 = allIp;
                                    }
                                }

                                console.log(data)
                                var xindata = data;
                                xindata.field = {
                                    IP: data.field.IP1,
                                    PORT: data.field.PORT1,
                                    TYPE: data.field.TYPE1
                                }
                                diaoyong(xindata)
                            });
                            form.on('submit(LAY-user-back-gkbsj2)', function(data) {
                                console.log(data)
                                    //判断IP地址是否正确IP
                                if (data.field.IP2 != "") {
                                    var IPAddress = data.field.IP2;
                                    var exp = /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/;
                                    var reg = IPAddress.match(exp);
                                    var ErrMsg = "你输入的Agent地址是一个非法的IP地址段！\nIP段为：:xxx.xxx.xxx.xxx（xxx为0-255)！";
                                    if (reg == null) {
                                        // alert(ErrMsg);
                                        layer.msg('你输入的IP地址是一个非法的IP地址段！IP段为：:xxx.xxx.xxx.xxx（xxx为0-255)！')
                                        return false;
                                    } else { //如果某一个数是两位，若前面有0，把0去掉
                                        var IPAddress = data.field.IP2;
                                        var IP = IPAddress.split(".");
                                        var allIp = "";
                                        for (i = 0; i < IP.length; i++) {
                                            if (IP[i].length == 2) {
                                                var index = IP[i].substring(0, 1);
                                                if (index == 0) {
                                                    IP[i] = IP[i].substring(1);
                                                }
                                            }
                                            allIp += IP[i] + ".";
                                        }
                                        allIp = allIp.substring(0, allIp.length - 1);
                                        data.field.IP2 = allIp;
                                    }
                                }
                                var xindata = data;
                                xindata.field = {
                                    IP: data.field.IP2,
                                    PORT: data.field.PORT2,
                                    TYPE: data.field.TYPE2
                                }
                                diaoyong(xindata)
                            });

                            function diaoyong(data) {
                                console.log(data)
                                var type = data.elem.getAttribute('data-type')
                                data.field.IP = data.field.IP.split('.')
                                for (var i = 0; i < 4; i++) {
                                    data.field.IP[i] = parseInt(data.field.IP[i])
                                }
                                console.log(data.field.IP)
                                data.field.PORT = parseInt(data.field.PORT)
                                data.field.TYPE = parseInt(data.field.TYPE)
                                var arr = {}
                                console.log(data.field)
                                _data.adminreadstate = 1

                                delete data.field.agvId;
                                delete data.field.ctrlId;

                                admin.req({
                                    url: setter.request.baseUrl + "agv-command/add",
                                    data: JSON.stringify({
                                        'agvId': parseInt(shujudata.agvId),
                                        'ctrlId': parseInt(shujudata.ctrlId),
                                        'code': type == 'bbbb' ? 8272 : 4099,
                                        'param': JSON.stringify(data.field),
                                        'status': 1
                                    }),
                                    type: "POST",
                                    dataType: "json",
                                    contentType: "application/json;charset=UTF-8",
                                    done: function(res) {
                                        layui.table.reload('LAY-app-message-all'); //重载表格
                                        layer.close(index); //执行关闭 
                                        layer.msg(res.msg);
                                    },

                                });
                            }
                        });
                    },
                });
            } else if (obj.event === "del") {
                layer.confirm("真的删除么", function(index) {
                    console.log(data)
                    delcardHandle({
                        idList: data.id,
                    });
                    obj.del();
                    layer.close(index);
                });
            }
        });
        //修改编辑
        function editwworkHandle(parms) {
            console.log(parms)
            admin.req({
                url: setter.request.baseUrl + "agv-device-status/update",
                data: JSON.stringify(parms),
                type: "post",
                dataType: "json",
                contentType: "application/json",
                done: function(res) {
                    layui.table.reload('LAY-app-message-all'); //重载表格
                    layer.close(index); //执行关闭 
                    layer.msg(res.msg);
                },
            });
        }
        //重启
        function editwworchongqi(parms) {
            console.log(parms)
            admin.req({
                url: setter.request.baseUrl + "agv-command/add",
                data: JSON.stringify(parms),
                type: "post",
                dataType: "json",
                contentType: "application/json",
                done: function(res) {
                    layui.table.reload('LAY-app-message-all'); //重载表格
                    layer.close(index); //执行关闭 
                    layer.msg(res.msg);
                },
            });
        }
        //删除
        function delcardHandle(params) {
            admin.req({
                url: setter.request.baseUrl + "agv-device-status/soft-delete",
                data: JSON.stringify({
                    idList: [params.idList]
                }),
                headers: {
                    'content-type': 'application/json',
                },
                type: "post",
                done: function(res) {
                    layer.msg(res.msg);
                },
            });
        }

        $('.layui-btn.layuiadmin-btn-useradmin').on('click', function() {
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });
    });
</script>

<script type="text/html" id="ctrlStatus">
    {{# if(d.ctrlStatus ==0){}} {{# return '离线'}} {{# } }} {{# if(d.ctrlStatus ==1){}} {{# return '在线'}} {{# } }} }}
</script>
<script type="text/html" id="agvStatus">
    {{# if(d.agvStatus ==0){}} {{# return '离线'}} {{# } }} {{# if(d.agvStatus ==1){}} {{# return '在线'}} {{# } }} }}
</script>
<!-- <script type="text/html" id="adminreadstate">
    {{# if(d.adminreadstate ==0){}} {{# return '未处理'}} {{# }}} {{# if(d.adminreadstate ==1 ){}} {{# return '已处理'}} {{# }}}
</script> -->